<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" 
	  xmlns:ui="http://java.sun.com/jsf/facelets" 
	  xmlns:h="http://java.sun.com/jsf/html" 
	  xmlns:f="http://java.sun.com/jsf/core" 
	  xmlns:p="http://primefaces.org/ui">
	<ui:composition template="../template/template.xhtml">
		<ui:define name="corpo-da-pagina"> 
			<!-- <h:outputText value="#{msg.reino_title}"/> -->
			<h:form id="formBalancoMesAno">
				<h:body>
					<p:commandButton id="listar" value="Listar" action="#{balancoMesAnoMB.listar}" update="formBalancoMesAno" ajax="false" />
			     	<p:panel id="panelBalancoGeral" header="Balaço Geral" rendered="#{balancoMesAnoMB.renderBalancoGeralPanel}" >
			    		<p:dataTable id="tabelaBalancoGeral" var="balanco" value="#{balancoMesAnoMB.listVOs}">
				    		<p:column headerText="Mes/Ano" style="text-align: right;">
				    			<h:outputText value="#{balanco.mesAno}"/>
				    		</p:column>
				    		<p:column headerText="Saldo Inicial" style="text-align: right;">
				    			<h:outputText value="#{balanco.saldoInicial}">
				    				<f:convertNumber currencySymbol="R$" type="currency"/>
				    			</h:outputText>
				    		</p:column>
				    		
				    		<p:column headerText="Ganho" style="text-align: right;">
				    			<p:commandLink action="#{balancoMesAnoMB.visualizarGanho}" update="detalhes" ajax="false" >
					    			<h:outputText value="#{balanco.ganho}">
					    				<f:convertNumber currencySymbol="R$" type="currency"/>
					    			</h:outputText>
					    			<f:setPropertyActionListener value="#{balanco}" target="#{balancoMesAnoMB.balancoMesAnoVO}" />
					    		</p:commandLink>	
				    		</p:column>
				    		<p:column headerText="Retido" style="text-align: right;">
				    			<p:commandLink action="#{balancoMesAnoMB.visualizarRetido}" update="detalhes" ajax="false" >
					    			<h:outputText value="#{balanco.retido}">
					    				<f:convertNumber currencySymbol="R$" type="currency"/>
					    			</h:outputText>
					    			<f:setPropertyActionListener value="#{balanco}" target="#{balancoMesAnoMB.balancoMesAnoVO}" />
					    		</p:commandLink>
				    		</p:column>
				    		<p:column headerText="Pag. Cartão" style="text-align: right;">
				    			<p:commandLink action="#{balancoMesAnoMB.visualizarPagCartao}" update="detalhes" ajax="false" >
					    			<h:outputText value="#{balanco.pagCartao}">
					    				<f:convertNumber currencySymbol="R$" type="currency"/>
					    			</h:outputText>
					    			<f:setPropertyActionListener value="#{balanco}" target="#{balancoMesAnoMB.balancoMesAnoVO}" />
					    		</p:commandLink>
				    		</p:column>
				    		<p:column headerText="Gastos" style="text-align: right;">
				    			<p:commandLink action="#{balancoMesAnoMB.visualizarGastos}" update="detalhes" ajax="false" >
					    			<h:outputText value="#{balanco.gasto}">
					    				<f:convertNumber currencySymbol="R$" type="currency"/>
					    			</h:outputText>
					    			<f:setPropertyActionListener value="#{balanco}" target="#{balancoMesAnoMB.balancoMesAnoVO}" />
					    		</p:commandLink>
				    		</p:column>
				    		<p:column headerText="Saldo Final" style="text-align: right;">
				    			<h:outputText value="#{balanco.saldoFinal}">
				    				<f:convertNumber currencySymbol="R$" type="currency"/>
				    			</h:outputText>
				    		</p:column>
				    		<p:column headerText="#{msg.column_delete}" style="text-align: center;"> 
								<p:commandLink action="#{balancoMesAnoMB.visualizarGastos}" ajax="false"> 
									<p:graphicImage value="#{pageContext.servletContext.contextPath}/img/lupa.gif" title="#{msg.column_delete}" /> 
					    			<f:setPropertyActionListener value="#{balanco}" target="#{balancoMesAnoMB.balancoMesAnoVO}" /> 
								</p:commandLink> 
							</p:column> 
			    		</p:dataTable>
			    		<br />
			    		<p:panelGrid id="resumoBalanco" columns="2">  
						    <h:outputLabel id="preriodoLabel" for="preriodo" value="Periodo em meses: " />  
						    <h:outputText id="preriodoValue" value="#{balancoMesAnoMB.periodoEmMeses}"/>
						    <h:outputLabel id="totalGanhoLabel" for="totalGanho" value="Total Ganho: " />  
						    <h:outputText id="totalGanhoValue" value="#{balancoMesAnoMB.totalGanho}" style="text-align: right;">
						    	<f:convertNumber currencySymbol="R$" type="currency"/>
						    </h:outputText>
						    <h:outputLabel id="totalRetidoLabel" for="totalRetido" value="Total Retido: " />  
						    <h:outputText id="totalRetidoValue" value="#{balancoMesAnoMB.totalRetido}" style="text-align: right;">
						    	<f:convertNumber currencySymbol="R$" type="currency"/>
						    </h:outputText>  
						    <h:outputLabel id="totalGastosLabel" for="totalGastos" value="Total Gastos: " />
						    <h:outputText id="totalGastosValue" value="#{balancoMesAnoMB.totalGastos}" style="text-align: right;">
						    	<f:convertNumber currencySymbol="R$" type="currency"/>
						    </h:outputText>
						    <h:outputLabel for="difGanhoGasto" value="Diferença Ganho Gasto: " />  
						    <h:outputText value="#{balancoMesAnoMB.difGanhoGasto}" style="text-align: right;">
						    	<f:convertNumber currencySymbol="R$" type="currency"/>
						    </h:outputText> 
						</p:panelGrid> 
		    		</p:panel>
		    		<p:panel id="detalhes" rendered="#{balancoMesAnoMB.renderDetalhes}">
			    		<p:panel id="detalheGanhoPanel" header="Detalhe Ganhos" rendered="#{balancoMesAnoMB.renderDetalheGanhoPanel}" style="max-width:400px;">
			    			<p:dataTable id="tabelaGanhos" var="detalheBalanco" value="#{balancoMesAnoMB.listDetalheBalancoVOs}">
			    				<p:column headerText="Data">
					    			<h:outputText value="#{detalheBalanco.data}"/>
					    		</p:column>
					    		<p:column headerText="Valor" style="text-align: right;">
					    			<h:outputText value="#{detalheBalanco.valor}">
						    			<f:convertNumber currencySymbol="R$" type="currency"/>
						    		</h:outputText>
					    		</p:column>
					    		<p:column headerText="Categoria">
					    			<h:outputText value="#{detalheBalanco.categoria}"/>
					    		</p:column>
			    			</p:dataTable>
			    		</p:panel>
			    		<p:panel id="detalheRetidoPanel" header="Detalhe Retido" rendered="#{balancoMesAnoMB.renderDetalheRetidoPanel}" style="max-width:400px;" >
			    			<p:dataTable id="tabelaDetalheRetido" var="detalheBalanco" value="#{balancoMesAnoMB.listDetalheBalancoVOs}">
			    				<p:column headerText="Data">
					    			<h:outputText value="#{detalheBalanco.data}"/>
					    		</p:column>
					    		<p:column headerText="Valor" style="text-align: right;">
					    			<h:outputText value="#{detalheBalanco.valor}">
						    			<f:convertNumber currencySymbol="R$" type="currency"/>
						    		</h:outputText>
					    		</p:column>
					    		<p:column headerText="Categoria">
					    			<h:outputText value="#{detalheBalanco.categoria}"/>
					    		</p:column>
			    			</p:dataTable>
			    		</p:panel>
			    		<p:panel id="detalhePagCartaoPanel" header="Detalhe Pagamneto Cartão" rendered="#{balancoMesAnoMB.renderDetalhePagCartaoPanel}" >
			    			<p:dataTable id="tabelaDetalhePagCartao" var="detalheBalanco" value="#{balancoMesAnoMB.listDetalheBalancoVOs}" style="max-width:400px;">
			    				<p:column headerText="Data" sortBy="Data">
					    			<h:outputText value="#{detalheBalanco.data}"/>
					    		</p:column>
					    		<p:column headerText="Valor"  sortBy="Valor" style="text-align: right;">
					    			<h:outputText value="#{detalheBalanco.valor}">
						    			<f:convertNumber currencySymbol="R$" type="currency"/>
						    		</h:outputText>
					    		</p:column>
					    		<p:column headerText="Categoria" sortBy="Categoria">
					    			<h:outputText value="#{detalheBalanco.categoria}"/>
					    		</p:column>
			    			</p:dataTable>
			    			<p:layout id="layout">  
							    <p:layoutUnit position="west" resizable="true" size="500" minSize="40" maxSize="500" style="border: none">  
							        West  
							    </p:layoutUnit>
							    <p:layoutUnit position="center">  
							        Center  
							    </p:layoutUnit>  
							</p:layout>  
			    			
			    			<p:panelGrid id="teste2" columns="2">
			    				<h:outputLabel  value="Teste" />
			    				<h:outputLabel  value="Teste" />
			    				<h:outputLabel  value="Teste" />
			    				<h:outputLabel  value="Teste" />
			    			</p:panelGrid>
			    		</p:panel>
			    		<p:panelGrid id="detalheGastosPanelGrid"  cellpadding="0" cellspacing="0" columns="2" style="align-adjustment: top; min-width: 60%" rendered="#{balancoMesAnoMB.renderDetalheGastosPanel}"> 
			    			<f:facet name="header">
				    			<p:row>  
						            <p:column>Detalhe Gastos</p:column>  
						        </p:row>
						        <p:row>  
						            <p:column></p:column>  
						        </p:row>
					        </f:facet>
					        <p:row>
			    			<p:dataTable id="tabelaDetalheGasto"   var="detalheBalanco" value="#{balancoMesAnoMB.listDetalheBalancoVOs}" style="max-width:600px;">
			    				<p:column headerText="Data" sortBy="#{detalheBalanco.data}" >
					    			<h:outputText value="#{detalheBalanco.data}"/>
					    		</p:column>
					    		<p:column headerText="Valor" sortBy="#{detalheBalanco.valor}" style="text-align: right;">
					    			<h:outputText value="#{detalheBalanco.valor}">
						    			<f:convertNumber currencySymbol="R$" type="currency"/>
						    		</h:outputText>
					    		</p:column>
					    		<p:column headerText="Categoria" sortBy="#{detalheBalanco.categoria}">
					    			<h:outputText value="#{detalheBalanco.categoria}"/>
					    		</p:column>
					    		<p:column headerText="Pago a" sortBy="#{detalheBalanco.pagado}">
					    			<h:outputText value="#{detalheBalanco.pagado}"/>
					    		</p:column>
			    			</p:dataTable>
			    			</p:row>
			    			<p:row>
			    			<p:dataTable id="tabelaRankingCategoria" var="detalheBalanco" value="#{balancoMesAnoMB.listRankingCategoriaPorMes}" >
					    		<p:column headerText="Categoria" sortBy="#{detalheBalanco.categoria}">
					    			<h:outputText value="#{detalheBalanco.categoria}"/>
					    		</p:column>
					    		<p:column headerText="Valor" sortBy="#{detalheBalanco.valor}" style="text-align: right;">
					    			<h:outputText value="#{detalheBalanco.valor}">
						    			<f:convertNumber currencySymbol="R$" type="currency"/>
						    		</h:outputText>
					    		</p:column>
			    			</p:dataTable>
			    			</p:row>
			    		</p:panelGrid>
			    		<p:panelGrid id="detalheGastosPanelGrid"  cellpadding="0" cellspacing="0" columns="2" style="align-adjustment: top; min-width: 60%" rendered="#{balancoMesAnoMB.renderDetalheOrcamentoPanel}">
			    			
			    		
			    		</p:panelGrid>
		    		</p:panel>
			  	</h:body>
			</h:form>
		</ui:define>
	 </ui:composition> 
</html>